<template>
    <div class="container">
        <LabelTitle title="买方购物要求" />
        <div class="item" v-for="it in list" :key="it?.value">
            <span class="label">{{it?.label}} : </span>
            <span class="value">{{it?.data[item[it?.value]]?.label}}</span>
        </div>
        <div class="item" v-for="it in dataList" :key="it.value">
            <span class="label">{{it?.label}} : </span>
            <span class="value">{{it?.format(item[it?.value])}}</span>
        </div>
        <div class="info">
            <span>
                申请日期: {{formatDate(item?.applyDate)}}
            </span>
            <span>
                签字人:{{item.signer}}
            </span>
        </div>


    </div>

</template>

<script lang="ts" setup>
import { computed } from "vue";
import { useBuyerStore } from "../../../../../store/user";
import { formatDate } from "../../../../../utils/date";
import { dataList, list } from "../../buyerList/data";
import LabelTitle from "../../../../../components/LabelTitle/index.vue";
defineProps(["item"])

</script>

<style lang="less" scoped>
.item {
    padding: 10px 2em;
    border-bottom: 1px dashed #ccc;
    text-align: left;
}

.label {
    width: 230px;
    display: inline-block;


}

h2 {
    font-weight: 400;
    color: var(--el-color-primary);
    text-align: center;
}

.info {
    margin-top: 20px;
    display: flex;
    font-weight: 700;
    justify-content: flex-end;

    span:first-child {
        margin-right: 1rem;
    }
}
</style>